<template>
	<view class="send-confirm-wrapper">
		<RTitle title="提交订单" url="/pages/runErrands/index"/>
		<OrderMap 
			v-if="showMap" 
			:centerAddress="nowAddress" 
			:start="mapStart" 
			:end="mapEnd" 
			:distanceNum="priceInfo.distance_num " />
		<view class="contents margin-tb-10">
			<view v-if="confirmType == 3">
				<SelectGoods class="border-b border-top-radius" :showTxt="sendGoods.showTxt" />
				<UploadImg 
					ref="upimg"
					:canUploadFile="true" 
					:limit="3"
					fileKeyName = 'imgFile'
					:uploadFileUrl="requestDomain + 'plugin.php?plugin=paotui&c=Paotui&a=up_img'" 
					:uImgList.sync="uImgList" 
					@uploadSuccess="uploadSuccess"
					class="border-bottom-radius uploadImg"></UploadImg>
				<AddressInput 
					addressDesc="从哪里发出" 
					type="sendStart" 
					addressFrom="send" 
					:addressInfo="sendStart"
					class="border-top-radius"></AddressInput>
				<AddressInput 
					class="recieve mb10 m-receive" 
					addressDesc="送到哪里去" 
					type="sendEnd" 
					addressFrom="receive" 
					:addressInfo="sendEnd"></AddressInput>
				
				<view class="border-radius widthAuto overHidden mb10">
				<view class="notes-box">
					<text>备注：</text>
					<input class="notes-input" type="text" placeholder="物品描述或送件要求" placeholder-style="font-size:14px;color:#aaa;" v-model="sendRemark" />
					<i class="iconfont icon-cha1" v-if="sendRemark" @click="clearRemark"></i>
				</view>
				<OrderTip class="border-b" :tip="tip" @getTip="getTip" />
				<SelectTime 
					v-if="timeInfo.length > 0" 
					:timeInfo="timeInfo" 
					:type="confirmType" 
					@getTime="getTime" />
				</view>
			</view>

			<view v-else>
				<view class="text-box border-radius mb10">
					<view class="desc-wrapper">
						<view v-if="Object.keys(shopInfo).length" style="margin-bottom: 10px;width: 50%;position: relative;">
							<shop-item :shop="shopInfo"></shop-item>
							<text style="position: absolute;left: 100%; top: 30px;">：</text>
						</view>
						<textarea class="buy-desc" placeholder="我想买..." maxlength="100" v-model="buyGoodsDesc" @input="buyGoodsInput"></textarea>
					</view>
				</view>
				<view class="mb10 buy-weight-box border-radius" v-if="showBuyWeight">
					<view class="buy-weight" @click="selectBuyWeight">
						<text class="left">商品重量</text>
						<view class="right">
							<text v-if="!buyGoodsWeight.showTxt">请选择</text>
							<text class="desc" v-else>{{ buyGoodsWeight.showTxt }}</text>
							<text class="icon-jiantou iconfont"></text>
						</view>
					</view>
				</view>

				<view class="predicted-box border-top-radius">
					<view class="predicted-cost" @click="openCostMask">
						<view class="left">
						<!-- 	<text class="icon-feiyong iconfont"></text> -->
							骑手垫付商品费
						</view>
						<view class="right">
							{{ estimatedCost ? currency + estimatedCost : '预估商品费' }}
							<text class="icon-jiantou iconfont"></text>
						</view>
					</view>
					<view class="global_mask" :class="{ active: showCostMask }" @click="openCostMask">
						<view class="mask-content cost-mask" @click.stop="preventDefault">
							<view class="title-box">
								<text @click="openCostMask">取消</text>
								<text class="title">预估商品费</text>
								<text @click="openCostMask('confirm')">确认</text>
							</view>
							<view class="desc">供骑手代购时参考</view>
							<view class="input-box" @click.stop="estimatedCostClick">
								<text>预估</text>
								<text class="icon">{{currency}}</text>
								<text class="width-tag" id="costWidthTag">{{ estimatedCostInput }}</text>
								<input id="estimatedCostInput" class="input" type="digit" maxlength="8" ref="costInput" :style="estimatedCostStyle" :focus="estimatedCostFocus" :value="estimatedCostInput" @input="inputCost" @blur="inputCost" @click.stop="preventDefault"/>
							</view>
						</view>
					</view>
				</view>
				<UploadImg 
					ref="upimg"
					:canUploadFile="true" 
					:limit="3"
					fileKeyName = 'imgFile'
					:uploadFileUrl="requestDomain + 'plugin.php?plugin=paotui&c=Paotui&a=up_img'" 
					:uImgList.sync="uImgList" 
					@uploadSuccess="uploadSuccess"
					class="border-bottom-radius uploadImg"></UploadImg>
				
				<view class="mb10 buy-select-address border-radius">
					<!-- <view class="select-address">
						<view>购买</view>
						<view class="item" :class="{ active: selectBuyAddress }" @click="selectBuyType(true)">
							指定地址
							<text class="desc">更精准</text>
						</view>
						<view v-if="hidePurchaseNearby == 0" class="item" :class="{ active: !selectBuyAddress }" @click="selectBuyType(false)">骑手就近购买</view>
					</view> -->
					<view v-if="selectBuyAddress">
						<AddressInput  key='buy_1' v-if="Object.keys(shopAddress).length" addressDesc="选择购买地址"  type="buyStart" addressFrom="send" :addressInfo="shopAddress"></AddressInput>
						<AddressInput key='buy_2' addressDesc="选择购买地址" v-else type="buyStart" addressFrom="send" :addressInfo="buyStart"></AddressInput>
					</view>
					
					<view class="border-box"><view class="border"></view></view>
					<AddressInput class="recieve" addressDesc="送到哪里去" type="buyEnd" addressFrom="receive" :addressInfo="buyEnd"></AddressInput>
				</view>
				
				<view class="border-radius widthAuto overHidden mb10">
					<OrderTip class="border-b" :tip="tip" @getTip="getTip" />
					<SelectTime v-if="timeInfo.length > 0" :timeInfo="timeInfo" :type="confirmType" @getTime="getTime" />
				</view>
				
			</view>
		</view>

		<TotalPrice :priceInfo="priceInfo" @saveOrder="getOrderId" :currency="currency" />
	</view>
</template>

<script>
import RTitle from './components/r-title.vue'
import OrderMap from './components/OrderMap';
import SelectGoods from './components/SelectGoods';
import AddressInput from './components/AddressInput';
import OrderTip from './components/OrderTip';
import TotalPrice from './components/TotalPrice';
import SelectTime from './components/SelectTime';
import ImgUploader from './components/ImgUploader';
import UploadImg from '../../appComponent/platcommon/uploadImg.vue';
import ShopItem from './components/ShopItem.vue';
import common from '../../utils/common.js';
var app = getApp();
var _this = this;

export default {
	name: 'SendConfirm',
	data() {
		return {
			confirmType: 3, // 当前订单类型
			showCostMask: false, // 是否显示预估商品费用弹窗
			selectBuyAddress: false, // 帮我买 是否选择了指定地址购买
			sendStart: '',
			sendEnd: '',
			sendGoods: '',
			sendRemark: '', // 帮我送 备注
			buyStart: '',
			buyEnd: '',
			tip: 0, // 小费
			publishDetail: '', // 一些公共信息：取件时间列表、计算规则等
			timeInfo: [],
			time: '', // 选择的时间值
			buyEndDefault: {},
			cid: '',
			showBuyWeight: true, // 是否显示帮我买商品重量
			buyGoodsDesc: '', // 帮我买商品描述
			buyGoodsWeight: {
				weight: 0
			}, // 帮我买商品重量
			priceInfo: { total_price: 0 }, // 价格信息
			estimatedCost: '', // 帮我买 预估商品费用
			estimatedCostFocus: false, // 帮我买输入框是否聚焦
			estimatedCostStyle: '',
			estimatedCostInput: '',
			files: [],
			quality: 0.5, // 图片压缩质量 0~1之间的数
			uImgList: [], // 需要上传的图片临时文件
			requestDomain: '',
			showMap: true,
			mapStart: '', // 地图起点
			mapEnd: '', // 地图终点
			nowAddress: {},
			shopInfo: {},
			shopAddress: {},
			hidePurchaseNearby: 0, // 1隐藏下订单页面的骑手就近购买
			currency: '¥',
		};
	},
	onLoad(options) {
		console.log('options',options)
		_this = this
		_this.nowAddress = {
			lng: options.lng,
			lat: options.lat
		}
		_this.requestDomain = common.requestDomain
		this.confirmType = app.globalData.confirmType;
		this.tip = app.globalData.tip;
		let runConfig = app.globalData.runConfig;
		this.hidePurchaseNearby =  runConfig.hide_purchase_nearby;
		console.log('确认订单页初始化', runConfig, this.confirmType);
		for (let i = 0; i < runConfig.catList.length; i++) {
			console.log('确认订单页初始化', runConfig.catList[i].type, this.confirmType);
			if (runConfig.catList[i].type == this.confirmType && runConfig.catList[i].cid == app.globalData.sendTypeCurrentId) {
				this.cid = runConfig.catList[i].cid;
				break;
			}
		}
		// this.updatePageInfo()
		common.changeCurrency(this);
	},
	onShow () {
		this.shopInfo= app.globalData.selectedShop || ''
		this.shopAddress= app.globalData.shopAddress || ''
		this.updatePageInfo()
	},
	
	onHide() {
		uni.pageScrollTo({
		    scrollTop: 0,
		    duration: 0
		});
		app.globalData.confirmBack = true;
	},
	onUnload() {
		uni.pageScrollTo({
		    scrollTop: 0,
		    duration: 0
		});
		app.globalData.confirmBack = true;
		setTimeout(function(){
			this.showMap = false
		}, 1000);
		// app.globalData.selectedShop = "";
	},
	methods: {
		// 从缓存更新页面数据 防止页面刷新
		updatePageInfo () {
			this.getPublishDetail();
			if (this.confirmType == 3) {
				app.globalData.confirmBack = true;
				this.mapStart = this.sendStart = app.globalData.sendStart;
				this.mapEnd = this.sendEnd = app.globalData.sendEnd;
				this.sendGoods = app.globalData.sendGoods;
				if(this.sendEnd != ''){
					this.getPrice();
				}
			} else {
				this.buyEndDefault = app.globalData.currentPosition;
				this.buyStart = app.globalData.buyStart;
				this.mapEnd = this.buyEnd = app.globalData.buyEnd;
				this.buyGoodsDesc = app.globalData.buyGoodsDesc;
				this.buyGoodsWeight = app.globalData.buyGoodsWeight;
				this.selectBuyAddress = app.globalData.selectBuyAddress;
				this.estimatedCost = app.globalData.estimatedCost;
				this.mapStart = app.globalData.selectBuyAddress ? this.buyStart : ''
				this.shopInfo = app.globalData.selectedShop;
				this.shopAddress = app.globalData.shopAddress;
				
				if(this.buyEnd != ''){
					this.getPrice();
				}

			}
			console.log('zyl this.selectBuyAddress', app.globalData.selectBuyAddress);
			if (app.globalData.runImgList) {
				this.uImgList = app.globalData.runImgList
			}
			
		},
		uploadSuccess(result) {
			// if(result.statusCode == 200) {
			// 	//上传成功的回调处理
			// 	toast('上传成功')
			// }else{
			// 	toast('上传失败')
			// }
		},
		preventDefault() {
			return false;
		},
		// 获取图片信息
		getImgFile(files) {
			app.globalData.imgFiles = this.files = files;
		},
		// 帮我买打开预估费用弹窗
		openCostMask(type) {
			if (type == 'confirm') {
				app.globalData.estimatedCost = this.estimatedCost = this.estimatedCostInput;
			}
			this.showCostMask = !this.showCostMask;
			if (this.showCostMask) {
				this.estimatedCostInput = this.estimatedCost;
				const query = uni.createSelectorQuery().in(this);
				if (_this.estimatedCostInput) {
					query.select('#costWidthTag').boundingClientRect(res => {
						console.log('得到布局位置信息', res);
						setTimeout(() => {
							_this.estimatedCostStyle = `width:${res.width + 8}px`;
							_this.estimatedCostFocus = true
						}, 100);
					}).exec();
				} else {
					setTimeout(() => {
					this.estimatedCostFocus = true
					_this.estimatedCostStyle = `width:2px`;
					}, 100);
				}
			} else {
				this.estimatedCostFocus = false
			}
		},
		// 帮我买 输入商品费用
		inputCost(e) {
			const query = uni.createSelectorQuery().in(this);
			this.estimatedCostInput = e.detail.value;
			console.log('333333333333333333', e);
			setTimeout(() => {
				if (_this.estimatedCostInput) {
					query.select('#costWidthTag').boundingClientRect(res => {
						console.log('得到布局位置信息', res);
						_this.estimatedCostStyle = `width:${res.width + 8}px`;
					}).exec();
				} else {
					_this.estimatedCostStyle = `width:2px`;
				}
			}, 300);
		},
		selectBuyWeight() {
			uni.navigateTo({
				url: '/pages/runErrands/goodsType'
			});
		},
		// 帮我买 是否指定地址购买
		selectBuyType(type) {
			if (type == this.selectBuyAddress) {
				return;
			}
			app.globalData.selectBuyAddress = this.selectBuyAddress = type;
			if (!type) {
				this.buyStart = '';
			} else {
				this.buyStart = app.globalData.buyStart;
			}
			this.mapStart = this.buyStart
		},
		// 帮我送 清除备注输入框
		clearRemark() {
			this.sendRemark = '';
		},
		// 获取小费的值
		getTip(tip) {
			console.log('44444444444', tip);
			app.globalData.tip = this.tip = tip;
			this.getPrice();
		},
		getTime(time) {
			this.time = time
			console.log('time', time)
			this.getPrice();
		},
		getPublishDetail() {
			console.log(this.shopInfo.id,'this.shopInfo.id')
			common.post('paotui&c=Paotui&a=publish_detail', { id: this.shopInfo.id, cid: this.cid, plugin: true }, res => {
				this.showBuyWeight = res.config.service_weight_multilevel_switch == 1;
				this.publishDetail = res;
				this.$nextTick(() => {
					this.timeInfo = res.daysList
				})
				
				// 基础配送费 店铺显示店铺，其他显示平台
				let basic_distance_price = 0
				if (!app.globalData.buyGoodsDesc && (!app.globalData.selectedShop.delivery_fee || !app.globalData.selectedShop)) {
					basic_distance_price = res.config_time.service_delivery_fee
				} else {
					basic_distance_price = app.globalData.buyGoodsDesc?res.config_time.service_delivery_fee:app.globalData.selectedShop.delivery_fee
				}
				let str = this.confirmType == 2 ? 'buy' : 'send';
				if (!this[str + 'End'].lng && !this[str + 'End'].lat) {
					this.$set(this.priceInfo,'basic_distance_price',basic_distance_price)
					this.$set(this.priceInfo,'total_price',basic_distance_price)
				}
			});
			// 送达地址获取区域配送配置
			let lat = '',lng = '';
			if (app.globalData.addressType == 'buyEnd' 
			|| app.globalData.addressType == 'sendEnd' 
			|| this.buyEnd || this.buyStart) {
				lat = app.globalData[app.globalData.addressType].lat || ''
				lng = app.globalData[app.globalData.addressType].lng || ''
			}
			console.log('lat',lat)
			console.log('lng',lng)
			let params = {
				plugin: true, 
				lat: lat, 
				lng: lng, 
				type: this.confirmType
			}
			if (this.shopInfo && this.shopInfo.id) {
				this.$set(params,'id',this.shopInfo.id)
			} else {
				this.$delete(params,'id')
			}
			if (lat && lng ) {
				common.post('paotui&c=Paotui&a=publish_config', params , res => {
					let { daysList,timeList } = res
					let daysArrList = []
					if (daysList.length && timeList.length) {
						daysList.forEach(itemDay => {
							let obj = {
								show: '',
								day: '',
								timeList: []
							}
							timeList.forEach(itemTime => {
								if (itemTime.length) {
									itemTime.forEach((item,index) => {
										if (itemDay == item.week ) {
											obj.show = item.week
										}
										if (itemDay == item.date) {
											obj.show = item.date
										}
										obj.day = item.date
										obj.timeList.push(item)
									})
								}
								
							})
							daysArrList.push(obj)
						})
					}
					this.timeInfo = daysArrList
					_this.$forceUpdate()
					console.log('timeInfo',this.timeInfo)
				});
			}
			
		},
		estimatedCostClick() {
			console.log('预估商品费的填写框被点击');
			//#ifdef H5
				document.getElementById("estimatedCostInput").focus();
			//#endif
			
			_this.estimatedCostFocus = false
			_this.$nextTick(function() {
				_this.estimatedCostStyle = _this.estimatedCostStyle;
				_this.estimatedCostFocus = true;
			});
		},
		buyGoodsInput(e) {
			this.buyGoodsDesc = e.detail.value
			if (this.buyGoodsDesc.length >= 100) {
				this.$toast('最多只能输入100个字');
			}
			app.globalData.buyGoodsDesc = this.buyGoodsDesc;
		},
		getPrice() {
			// if (!this.time) return
			// service_buy_deliver_times_switch 1 时间配置开启
			console.log('this.publishDetail',this.publishDetail)
			if (!this.publishDetail && !this.time) return
			if (this.publishDetail && this.publishDetail.config.service_buy_deliver_times_switch == '1' && !this.time) return
			let priceParam = {
				id: this.shopInfo.id,
				cid: this.cid,
				buy_type: this.selectBuyAddress ? 2 : 1,
				time_info: this.time,
				tip_price: this.tip,
				weight: this.confirmType == 3 ? this.sendGoods.weight : this.buyGoodsWeight.weight,
				plugin: true
			};
			let str = this.confirmType == 2 ? 'buy' : 'send';
			if (this[str + 'Start']) {
				priceParam.start_adress_lng = this[str + 'Start'].lng;
				priceParam.start_adress_lat = this[str + 'Start'].lat;
			}
			if (this[str + 'End']) {
				priceParam.end_adress_lng = this[str + 'End'].lng;
				priceParam.end_adress_lat = this[str + 'End'].lat;
			}
			common.post('paotui&c=Paotui&a=compute_money', priceParam, function(res){
				console.log('计算价格结果', res);
				for (let k in res) {
					_this.$set(_this.priceInfo,k,res[k])
				}
			})
		},
		// 提交订单
		async getOrderId() {
			// 图片上传调用
			console.log('this.uImgList',this.uImgList)
			/* if (this.uImgList.length > 0) {
				this.$refs.upimg.upload()
			} */
			let img = ''
			if (this.uImgList.length) {
				img = this.uImgList.join(';')
			}
			let type = this.confirmType == 2 ? 'buy' : 'send';
			let param = {
				'cid': this.cid,
				'time_info': this.time,
				'tip_price': this.tip,
				'plugin': true,
				'img': img || ''
			};
			
			if (type == 'send') {
				param['weight'] = this.sendGoods.weight
				param['remarks'] = this.sendRemark
				param['goods_catgory'] = this.sendGoods.type
				param['weight_tip'] = this.sendGoods.weightTip || ''
				
				if (this.sendGoods.serviceWeight) {
					param['start_weight'] = this.sendGoods.serviceWeight.start_weight
					param['end_weight'] = this.sendGoods.serviceWeight.end_weight
				}
				
				if(!this.sendGoods.type || this.sendGoods.type == ''){
					uni.showToast({
					    title: '请选择物品类型',
						icon: 'none',
					    duration: 2000
					});
					return;
				}
			} else {
				param['weight'] = this.buyGoodsWeight.weight
				param['weight_tip'] = this.buyGoodsWeight.weightTip || ''
				let buyType = this.selectBuyAddress ? 2 : 1;
				param['buy_type'] = buyType
				param['estimate_goods_price'] = this.estimatedCost
				param['goods_remarks'] = this.buyGoodsDesc
				if (this.buyGoodsWeight.serviceWeight) {
					param['start_weight'] = this.buyGoodsWeight.serviceWeight.start_weight
					param['end_weight'] = this.buyGoodsWeight.serviceWeight.end_weight
					param['weight_price'] = this.buyGoodsWeight.serviceWeight.weight_price
				}
			}
			if (this[type + 'Start']) {
				param['start_adress_lng'] = this[type + 'Start'].lng
				param['start_adress_lat'] = this[type + 'Start'].lat
				param['start_adress_name'] = this[type + 'Start'].name
				param['start_adress_phone'] = this[type + 'Start'].phone
				param['start_adress_detail'] = this[type + 'Start'].adress + ' ' + this[type + 'Start'].detail
				param['start_adress_area_id'] = this[type + 'Start'].adress_id
				param['start_area_id'] = this[type + 'Start'].area
				param['start_city_id'] = this[type + 'Start'].city
				param['start_province_id'] = this[type + 'Start'].province
			}
			if (this[type + 'End']) {
				param['end_adress_lng'] = this[type + 'End'].lng
				param['end_adress_lat'] = this[type + 'End'].lat
				param['end_adress_name'] = this[type + 'End'].name
				param['end_adress_phone'] = this[type + 'End'].phone
				param['end_adress_detail'] = this[type + 'End'].adress + ' ' + this[type + 'End'].detail
			}

			let url = '';
			if (type == 'send') {
				url = 'paotui&c=Paotui&a=publish_give_data'
			} else {
				param.id = this.shopInfo.id
				url = 'paotui&c=Paotui&a=publish_buy_data'
			}
			
			common.post(url, param, (res) => {
				console.log('点击提交按钮', res);
				
				//#ifdef H5
				if (common.$checkPlat.checkWeixinApp()) {
					common.jweixin.miniProgram.navigateTo({
						url: `/pages/pay/index?order_id=${res.order_id}&type=${res.type}`
					});
				} else {
					uni.navigateTo({
						url: `/pages/shop_new/confirmOrder/pay?order_id=${res.order_id}&type=${res.type}`
					})
				}
				//#endif
				
				//#ifdef MP-WEIXIN || MP-ALIPAY
					uni.navigateTo({
						url: `/pages/shop_new/confirmOrder/pay?order_id=${res.order_id}&type=${res.type}`
					})
				//#endif
			})
		}
	},
	components: {
		RTitle,
		OrderMap,
		SelectGoods,
		AddressInput,
		OrderTip,
		TotalPrice,
		SelectTime,
		ImgUploader,
		UploadImg,
		ShopItem
	}
};
</script>

<style lang="stylus">
$theme-color=#00c78c
.m-receive
	border none
.send-confirm-wrapper
    height 100vh
	background-color #f4f4f4
	padding-bottom 100upx
	overflow hidden
	.icon-jiantou {
		vertical-align middle
	}
	.contents
		padding 0 10px
		height -webkit-calc(100% - 220px)
		height calc(100% - 220px)
		height calc(100% - 220px - env(safe-area-inset-bottom))
		height calc(100% - 220px - constant(safe-area-inset-bottom))
		overflow-y auto
		.border-b
			border-bottom 1PX solid #efefef
		.select-goods
			padding 10px
			color #333
		.address-input
			border none !important
			padding 0 10px
		.notes-box
			background #fff
			font-size 14px
			padding 16px 10px
			display flex
			align-items center
			border-bottom 1PX solid #efefef
			.notes-input
				flex-grow 1
				margin 1px 10px 0 10px
			.icon-cha1
				color #999999
		.time-box
			background #fff
			display flex
			align-items center
			justify-content space-between
			padding 18px 10px
			font-size 14px
		.time-mask
			.picker
				.picker-slot
					font-size 14px
					.picker-item
						opacity 0.4
						&.picker-selected
							opacity 1
		.title-box
			display flex
			justify-content space-between
			align-items center
			font-size 14px
			padding 15px 10px
			border-bottom 1PX solid #e5e5e5
			.title
				font-size 15px
		.text-box
			padding 10px 10px 0 10px
			background #fff
			.desc-wrapper
				padding-bottom 10px
				.buy-desc
					width 100%
					resize none
					height 115px
					font-size 14px
					line-height 1.4
		.buy-weight-box
			background #fff
			.buy-weight
				display flex
				align-items center
				justify-content space-between
				background #ffffff
				/* border-bottom 1PX solid #efefef */
				margin 0 10px
				padding 18px 0
				font-size 14px
				.right
					color #999
					.desc
						color #333
					.icon
						vertical-align middle
		.predicted-box
			background #fff
			padding 0 10px
			.predicted-cost
				border-bottom 1PX solid #efefef
				background #fff
				padding 15px 0
				font-size 14px
				display flex
				justify-content space-between
				align-items center
				.left
					.iconfont
						margin-right 5px
				.right
					color #999
			.cost-mask
				font-size 14px
				text-align center
				.desc
					padding 15px 0
				.input-box
					border 1PX solid #00c78c
					margin 0 10px 15px
					padding 6px
					color #00c78c
					position relative
					display flex
					align-items center
					justify-content center
					.icon
						margin 0 2px 0 5px
					.input
						width 2PX
						text-align center
						color #04b7a5
					.width-tag
						position absolute
						top -9999px
						left -9999px
		.arrive-time
			background #ffffff
			display flex
			justify-content space-between
			font-size 14px
			padding 19.5px 10px
		.buy-select-address
			width 100%
			overflow hidden
			.select-address
				display flex
				align-items center
				background #ffffff
				font-size 14px
				padding 15px 10px
				.item
					margin-left 15px
					border 1px solid #ddd
					padding 4px 5px
					&.active
						border-color $theme-color
						background rgba($theme-color, 0.1)
					.desc
						font-size 12px
						color $theme-color
						margin-left 5px
			.border-box
				padding 0 10px
				background #fff
				.border
					border-bottom 1PX solid #efefef
	.margin-tb-10
		margin 10px 0
	.border-radius
		border-radius 6px
	.border-top-radius 
		border-radius 6px 6px 0 0
	.border-bottom-radius
		border-radius 0 0 6px 6px
	.widthAuto
		width 100%
	.overHidden
		overflow hidden
	.margin-right-6
		margin-right -6px
	.uploadImg /deep/ .upload-title .right 
		margin-right 4px
</style>
